﻿<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../css/my-auditmanage.css" />
		<style type="text/css">
			[v-cloak] {
				display: none !important;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">审核管理</h1>
			<a id="btnreshload" class="mui-icon mui-icon-right-nav mui-pull-right mui-icon mui-icon-refreshempty" style="padding-right: 20px;"></a>
		</header>
		<div class="mui-content" id="mui-content" v-cloak>
			<div style="padding: 10px;">
				<div class="mui-segmented-control mui-segmented-control-negative">
					<a class="mui-control-item mui-active" href="#item1">待办</a>
					<a class="mui-control-item" href="#item2">已办</a>
					<a class="mui-control-item" href="#item3">发起</a>
				</div>
			</div>

			<div id="item1" class="mui-control-content mui-scroll-wrapper mui-active ">
				<div class="mui-scroll">
					<ul class="mui-table-view">
						<li class="mui-table-view-cell" v-if="pendingItems.length ==0 ">
							<a href="javascript:;">
								<div class="mui-media-body" style="padding: 0 15px;">
									<div class="mui-card-content-inner" style="padding-top: 10px; padding-bottom: 0; text-align: center;">
										<p style="display:inline;">暂无数据...</p>
									</div>
								</div>
							</a>
						</li>
						<li class="mui-table-view-cell" v-else v-for="item in pendingItems">
							<a href="javascript:;" @click="openShowDetail(0,item.business==1?'发布文章':'推荐文章',item.businessDataId,item.nodeId,item.id)">
								<div class="mui-media-body" style="padding: 0 15px;">
									<div class="mui-ellipsis-2">{{item.title}}</div>
								</div>
								<div class="mui-card-content-inner" style="padding-top: 10px; padding-bottom: 0;">
									<p style="color: #333;">{{item.business==1?'发布文章':'推荐文章'}} 【{{item.user.name}}】</p>
									<p style="display:inline;">{{item.receiveTime}}</p>
									<p v-if="item.status == 1" class="mui-pull-right mui-badge mui-badge-primary" style="color: #fff;display:inline;">发起</p>
									<p v-else-if="item.status == 2" class="mui-pull-right mui-badge mui-badge-success" style="color: #fff;display:inline;">已结束</p>
									<p v-else-if="item.status == 3" class="mui-pull-right mui-badge mui-badge-warning" style="color: #fff;display:inline;">终止</p>
									<p v-else-if="item.status == 4" class="mui-pull-right mui-badge mui-badge-danger" style="color: #fff;display:inline;">取消</p>
									<p v-else class="mui-pull-right mui-badge mui-badge-purple" style="color: #fff;display:inline;">被退回</p>
									<!--<p class="mui-pull-right mui-badge mui-badge-danger" style="color: #fff;display:inline;">待审中</p>
                                        <p class="mui-pull-right mui-badge mui-badge-warning" style="color: #fff;display:inline;">已结束</p>
                                        <p class="mui-pull-right mui-badge mui-badge-success" style="color: #fff;display:inline;">已结束</p>
                                        <p class="mui-pull-right mui-badge mui-badge-purple" style="color: #fff;display:inline;">已超期</p>-->
								</div>
							</a>
						</li>
					</ul>
					<a href="javascript:;" v-show="isPendingmoreflag" class="showmore" @click="openShowMore(1)">
						<p>查看更多</p>
					</a>
				</div>
			</div>
			<div id="item2" class="mui-control-content mui-scroll-wrapper">
				<div class="mui-scroll">
					<ul class="mui-table-view">
						<li class="mui-table-view-cell" v-if="overItems.length == 0">
							<a href="javascript:;">
								<div class="mui-media-body" style="padding: 0 15px;">
									<div class="mui-card-content-inner" style="padding-top: 10px; padding-bottom: 0; text-align: center;">
										<p style="display:inline;">暂无数据...</p>
									</div>
								</div>
							</a>
						</li>
						<li class="mui-table-view-cell" v-else v-for="item in overItems">
							<a href="javascript:;" @click="openShowDetail(1,item.business==1?'发布文章':'推荐文章',item.businessDataId,item.nodeId,item.id)">
								<div class="mui-media-body" style="padding: 0 15px;">
									<div class="mui-ellipsis-2">{{item.title}}</div>
								</div>
								<div class="mui-card-content-inner" style="padding-top: 10px; padding-bottom: 0;">
									<p style="color: #333;">{{item.business==1?'发布文章':'推荐文章'}} 【{{item.user.name}}】</p>
									<p style="display:inline;">{{item.receiveTime}}</p>
									<p v-if="item.status == 1" class="mui-pull-right mui-badge mui-badge-primary" style="color: #fff;display:inline;">发起</p>
									<p v-else-if="item.status == 2" class="mui-pull-right mui-badge" style="color: #fff;display:inline;">已结束</p>
									<p v-else-if="item.status == 3" class="mui-pull-right mui-badge mui-badge-warning" style="color: #fff;display:inline;">终止</p>
									<p v-else-if="item.status == 4" class="mui-pull-right mui-badge mui-badge-danger" style="color: #fff;display:inline;">取消</p>
									<p v-else class="mui-pull-right mui-badge mui-badge-purple" style="color: #fff;display:inline;">被退回</p>
									<!--<p class="mui-pull-right mui-badge mui-badge-danger" style="color: #fff;display:inline;">待审中</p>
                                    <p class="mui-pull-right mui-badge mui-badge-warning" style="color: #fff;display:inline;">已结束</p>
                                    <p class="mui-pull-right mui-badge mui-badge-success" style="color: #fff;display:inline;">已结束</p>
                                    <p class="mui-pull-right mui-badge mui-badge-purple" style="color: #fff;display:inline;">已超期</p>-->
								</div>
							</a>
						</li>
					</ul>
					<a href="javascript:;" v-show="isOvermoreflag" class="showmore" @click="openShowMore(2)">
						<p>查看更多</p>
					</a>
				</div>
			</div>
			<div id="item3" class="mui-control-content mui-scroll-wrapper">
				<div class="mui-scroll">
					<ul class="mui-table-view">
						<li class="mui-table-view-cell" v-if="myItems.length == 0">
							<a href="javascript:;">
								<div class="mui-media-body" style="padding: 0 15px;">
									<div class="mui-card-content-inner" style="padding-top: 10px; padding-bottom: 0; text-align: center;">
										<p style="display:inline;">暂无数据...</p>
									</div>
								</div>
							</a>
						</li>
						<li class="mui-table-view-cell" v-else v-for="item in myItems">
							<a href="javascript:;" @click="openShowDetail(2,item.business==1?'发布文章':'推荐文章',item.businessDataId)">
								<div class="mui-media-body" style="padding: 0 15px;">
									<div class="mui-ellipsis-2">{{item.title}}</div>
								</div>
								<div class="mui-card-content-inner" style="padding-top: 10px; padding-bottom: 0;">
									<p style="color: #333;">{{item.business==1?'发布文章':'推荐文章'}} 【{{item.user.name}}】</p>
									<p style="display:inline;">{{item.receiveTime}}</p>
									<p v-if="item.status == 1" class="mui-pull-right mui-badge mui-badge-primary" style="color: #fff;display:inline;">发起</p>
									<p v-else-if="item.status == 2" class="mui-pull-right mui-badge" style="color: #fff;display:inline;">已结束</p>
									<p v-else-if="item.status == 3" class="mui-pull-right mui-badge mui-badge-warning" style="color: #fff;display:inline;">终止</p>
									<p v-else-if="item.status == 4" class="mui-pull-right mui-badge mui-badge-danger" style="color: #fff;display:inline;">取消</p>
									<p v-else class="mui-pull-right mui-badge mui-badge-purple" style="color: #fff;display:inline;">被退回</p>
									<!--<p class="mui-pull-right mui-badge mui-badge-danger" style="color: #fff;display:inline;">待审中</p>
                                    <p class="mui-pull-right mui-badge mui-badge-warning" style="color: #fff;display:inline;">已结束</p>
                                    <p class="mui-pull-right mui-badge mui-badge-success" style="color: #fff;display:inline;">已结束</p>
                                    <p class="mui-pull-right mui-badge mui-badge-purple" style="color: #fff;display:inline;">已超期</p>-->
								</div>
							</a>
						</li>
					</ul>
					<a href="javascript:;" v-show="isMymoreflag" class="showmore" @click="openShowMore(3)">
						<p>查看更多</p>
					</a>
				</div>
			</div>
		</div>
	</body>

</html>
<script type="text/javascript" src="../js/mui.min.js"></script>
<script type="text/javascript" src="../js/jquery-2.1.0.js"></script>
<script type="text/javascript" src="../js/config.js"></script>
<script type="text/javascript" src="../js/common.js"></script>
<script type="text/javascript" src="../js/localStorage.js"></script>
<script type="text/javascript" src="../js/vue.min.js"></script>
<script type="text/javascript">
	var offset = 0; //	当前页码
	var limit = 5; //	显示条数
	var pendingtotal = 0; //	待办总数
	var overtotal = 0; //	已办总数
	var mytotal = 0; //	发起总数
	var waiting; //	加载动画	
	var auditvm;
	var isPendingmoreflag = false;
	var isOvermoreflag = false;
	var isMymoreflag = false;

	mui.init();

	//屏幕可用工作区高度
	var contentHeight = window.screen.availHeight - 125;
	$(".mui-control-content").height(contentHeight);

	initDom();

	getAuditData(1); //待办
	getAuditData(2); //已办
	getAuditData(3); //已发

	mui.plusReady(function() {

		//	监听待办、已办审核状态更新
		window.addEventListener('msgAuditmanage', function(e) {
			getAuditData(1); //待办
			getAuditData(2); //已办
		});

		mui('body').on('tap', '#btnreshload', function() {

			waiting = plus.nativeUI.showWaiting("数据加载中...");

			offset = 0;
			limit = 5;
			isPendingmoreflag = false;
			isOvermoreflag = false;
			isMymoreflag = false;
			if(auditvm) {

				auditvm.pendingItems = [];
				auditvm.overItems = [];
				auditvm.myItems = [];
				auditvm.pendinglimit = 5;
				auditvm.overlimit = 5;
				auditvm.mylimit = 5;
				auditvm.templimit = 5;
			}
			getAuditData(1); //待办
			getAuditData(2); //已办
			getAuditData(3); //已发

		})

	});

	//	初始化DOM
	function initDom() {
		auditvm = new Vue({
			el: "#mui-content",
			data: {
				pendingItems: [],
				overItems: [],
				myItems: [],
				pendingtotal: pendingtotal,
				overtotal: overtotal,
				mytotal: mytotal,
				isPendingmoreflag: isPendingmoreflag,
				isOvermoreflag: isOvermoreflag,
				isMymoreflag: isMymoreflag,
				pendinglimit: 5, //	显示条数
				overlimit: 5, //	显示条数
				mylimit: 5, //	显示条数
				templimit: 5
			},
			methods: {

				//	查看审核详情
				openShowDetail: function(type, columname, detailid, nodeid, workid) {
					mui.openWindow({
						url: '/html/my-auditmanage-zx.html',
						id: 'my-auditmanage-zx',
						createNew: false,
						extras: {
							'type': type, // 0 待办 1已办 2发起
							'detailid': detailid,
							'columname': columname,
							'nodeid': nodeid,
							'workid': workid,
						},
						show: {
							autoShow: true,
							aniShow: 'slide-in-right',
							duration: 300
						},
						waiting: {
							autoShow: false,
							title: '正在加载...'
						}
					})
				},

				//	查看更多
				openShowMore: function(type) {
					//console.log('查看更多=' + type);
					var templimt = this.templimit;
					switch(type) {
						case 1:
							this.isPendingmoreflag = this.pendingtotal > this.pendinglimit + 5 ? true : false;
							this.pendinglimit += 5;
							templimt = this.pendinglimit;
							break;
						case 2:
							console.log('this.overtotal :' + this.overtotal);
							console.log('this.overlimit :' + this.overlimit);
							this.isOvermoreflag = this.overtotal > this.overlimit + 5 ? true : false;
							//console.log(isOvermoreflag);
							this.overlimit += 5;
							templimt = this.overlimit;
							break;
						case 3:
							this.isMymoreflag = this.mytotal > this.mylimit + 5 ? true : false;
							this.mylimit += 5;
							templimt = this.mylimit;
							break;
						default:
							break;
					}
					
					//console.log('显示条数:' + templimt);
					waiting = plus.nativeUI.showWaiting("数据加载中...");
					setTimeout(function() {
						ctdj.workflow.getworks('', '', type, offset, templimt, function(r) {
							if(r.success) {
								$.each(r.result.items, function(index, item) {
									item.receiveTime = item.receiveTime.split('.')[0].replace('T', ' ');
								});

								switch(type) {
									case 1:
										auditvm.pendingItems = r.result.items;
										auditvm.pendingtotal = r.result.totalCount;
										auditvm.isPendingmoreflag = auditvm.pendingtotal > auditvm.pendinglimit + 5 ? true : false;
										break;
									case 2:
										auditvm.overItems = r.result.items;
										auditvm.overtotal = r.result.totalCount;
										auditvm.isOvermoreflag = r.result.totalCount > auditvm.overlimit + 5 ? true : false;
										break;
									case 3:
										auditvm.myItems = r.result.items;
										auditvm.mytotal = r.result.totalCount;
										auditvm.isMymoreflag = r.result.totalCount > auditvm.mylimit + 5 ? true : false;
										break;
									default:
										break;
								}

							}

							if(waiting) {
								setTimeout(function() {
									waiting.close();
								}, 800);
							}

						})
					}, 1000)
				}
			}
		})

	}

	// 待办流程数据
	function getAuditData(type) {
		ctdj.workflow.getworks('', '', type, offset, limit, function(r) {
			if(r.success) {
				//total = r.result.totalCount;
				$.each(r.result.items, function(index, item) {
					item.receiveTime = item.receiveTime.split('.')[0].replace('T', ' ');
				});
				switch(type) {
					case 1:
						auditvm.pendingItems = r.result.items;
						auditvm.pendingtotal = r.result.totalCount;
						auditvm.isPendingmoreflag = r.result.totalCount > r.result.items.length ? true : false;
						//console.log(auditvm.isPendingmoreflag);
						break;
					case 2:
						auditvm.overItems = r.result.items;
						auditvm.overtotal = r.result.totalCount;
						auditvm.isOvermoreflag = r.result.totalCount > r.result.items.length ? true : false;
						break;
					case 3:
						auditvm.myItems = r.result.items;
						auditvm.mytotal = r.result.totalCount;
						auditvm.isMymoreflag = r.result.totalCount > r.result.items.length ? true : false;
						break;
					default:
						break;
				}

			}

			if(waiting) {
				setTimeout(function() {
					waiting.close();
				}, 800);
			}

			setTimeout(function() {
				mui(".mui-scroll-wrapper").scroll();
			}, 500);

		})
	}
</script>